import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import ReactEcharts from 'echarts-for-react';
import MoneyIcon from '../../assets/images/money_icon.png';
import { MONEY_CHART_PAR } from '../../config/echarts.config';

const styleList = [
    "rotateY(7) rotateX(3deg)",
    "rotateY(60deg) rotateX(-2deg)",
    "rotateY(90deg) rotateX(5deg)",
]
class MoneyInfo extends PureComponent {
    constructor(props) {
        super(props);
        this.state = {
            checkIndex: 0
        };
        _.bindAll(this, [
        ]);
    }

    componentDidMount(){

    }

    render() {
        let props = this.props;
        return (
            <div className="money-info user-bg-img">
                <div className="user-title">
                    <img className="money-icon" src={ MoneyIcon } alt="" />
                    <span>金融信息</span>
                </div>
                <div className="par-box">
                    {
                        _.map([1,2,3,4,5], (val, key)=>{
                            return <div key={key} className="par-list" style={{transform: `rotateY(${(key+1)*72}deg) translateZ(410px)`}}>
                                <div className="par-title">
                                    <span className="par-name">企业名称</span><i></i>
                                    <span className="par-remarks">近15天各资产端融资数据</span>
                                </div>
                                <div className="par-content">
                                    <ReactEcharts 
                                        option = { MONEY_CHART_PAR }
                                        style={{ height: "100%" }}
                                    />
                                </div>
                            </div> 
                        })
                    }
                </div>
            </div>
        )
    }
}

MoneyInfo.propTypes = {
    name: PropTypes.string
}
export default MoneyInfo;